/*
 * @Author: qinuoyun
 * @Date:   2019-11-01 10:47:39
 * @Last Modified by:   sean
 * @Last Modified time: 2019-12-30 16:13:27
 */
import Vue from 'vue'
// 导入模型
import importModel from '../plugins/import-model'

// 创建模型
import createModel from '../plugins/create-model'

// 新建页面
import createPages from '../plugins/create-page'
// 新建组件
import createComponent from '../plugins/create-component'
// 打开文件
import openFile from '../plugins/open-file'
// 右键菜单
import rightMenu from '../plugins/right-menu'
// 编辑页面
import editPage from '../plugins/edit-page'
// 编辑组件
import editComponent from '../plugins/edit-component'
// 编辑模型
import editModel from '../plugins/edit-model'


const drive = {
  "model": Vue.extend(importModel),
  "create": Vue.extend(createModel),

  "newpage": Vue.extend(createPages),
  "openfile": Vue.extend(openFile),
  "newcomponent": Vue.extend(createComponent),
  "rightmenu": Vue.extend(rightMenu),
  "editPage": Vue.extend(editPage),
  "editComponent": Vue.extend(editComponent),
  "editModel": Vue.extend(editModel)
}

/**
 * 事件绑定
 * @param {any} element  绑定dom
 * @param {any} event    事件类型
 * @param {any} listener 方法
 */
function addEvent(element, event, listener) {
  if (element.addEventListener) {
    element.addEventListener(event, listener, false);
  } else if (element.attachEvent) {
    element.attachEvent('on' + event, listener);
  } else {
    element['on' + event] = listener;
  }
}


let getAnInstance = (data, type) => {
  //用于处理VUECX
  let instance = new drive[type]({
    propsData: {
      value: data
    },
    parent:vm,
    el: document.createElement('div')
  })
  return instance;
}

let pool = {};

let vm = null

let copy_model = []; 
let copy_instance = null;

let directives = {

  dialog: {
    bind: function(el, binding, vnode) { //被绑定
      if(vm == null){
        vm = vnode.context;
      }
    },
    update: function(el, binding, vnode) { //组件更新
      let type = el.dataset.type;
      pool[type] = binding.value;
    },
    // 指令的定义
    inserted: function(el, binding, vnode) {
      let type = el.dataset.type;
      if (!pool[type]) {
        pool[type] = binding.value;
      }
      addEvent(el, 'click', function() {
        let data = pool[type];
        let instance = getAnInstance(data, type)
        console.log('vm',vm);
        console.log('log',vm);
        let model = vm.$el.appendChild(instance.$el);
        instance.dialogVisible = true;
        instance.$watch('dialogVisible', function() {
          instance.dialogVisible = false;
          vm.$el.removeChild(model)
        });
      });
    }
  },


 
  menu: {
    bind: function(el, binding, vnode) { //被绑定
      vm = null;
      if(vm == null){
        vm = vnode.context.$root.$children[0].$children[0].$children[0];
      }
    },
    update: function(el, binding, vnode) { //组件更新
      let type = el.dataset.type;
      pool[type] = binding.value;
    },
    // 指令的定义
    inserted: function(el, binding, vnode) {
      let type = el.dataset.type;
      if (!pool[type]) {
        pool[type] = binding.value;
      }
      addEvent(el, 'click', function() {
        if(copy_model.length > 0){
          vm.$el.removeChild(copy_model[0]);
          copy_model.splice(0,1);
        }
      });
      addEvent(el, 'contextmenu', function() {
        if(copy_model.length > 0){
          vm.$el.removeChild(copy_model[0]);
          copy_model.splice(0,1);
        }
        let data = pool[type];
        let instance = getAnInstance(data, type)
        let model = vm.$el.appendChild(instance.$el);
        copy_model.push(model);
        instance.isDisplay = true;
        instance.$watch('isDisplay', function() {
          vm.$el.removeChild(copy_model[0]);
          copy_model.splice(0,1);
        })
      });


    }
  },


}

export default directives;
